import { message } from "@/utils/message";
import {
  queryProducePaperExtByPaper,
  queryProduceQuestionByType
} from "@/api/exam";
import { ref, onMounted } from "vue";

export function useForm() {
  const questionTypeRef = ref(0);
  const questionTableRef = ref();
  const questionDataList = ref([]);
  const questionSelectRef = ref([]);
  const scoreAllRef = ref(0);
  const type0Ref = ref(0);
  const type1Ref = ref(0);
  const type2Ref = ref(0);
  const type3Ref = ref(0);

  const scoreFormInline = ref({
    type0: 0,
    type1: 0,
    type2: 0,
    type3: 0
  });

  async function queryPaperExtData(paperId, type) {
    queryProducePaperExtByPaper({
      id: paperId
    }).then(res => {
      if (res.success) {
        questionSelectRef.value = res.questionList;
        scoreFormInline.value = res.scoreList;
        if (type == 0) {
          const { toggleRowSelection } = questionTableRef.value.getTableRef();
          questionSelectRef.value.forEach(row => {
            toggleRowSelection(row, undefined);
          });
          handleTypeChange(questionTypeRef.value);
          countScoreAll(questionSelectRef.value);
        }
      } else {
        message("查询数据异常:" + res.errMsg, { type: "error" });
      }
    });
  }

  async function handleTypeChange(value) {
    queryProduceQuestionByType({
      type: value
    })
      .then(res => {
        if (res.success) {
          questionDataList.value = res.data.list;
        } else {
          message("查询数据异常:" + res.errMsg, { type: "error" });
        }
      })
      .catch(error => {
        message("查询数据异常:" + JSON.stringify(error), { type: "error" });
      });
  }
  const handleSelectionChange = val => {
    questionSelectRef.value = val;
  };

  function countScoreAll(newValue) {
    let scoreAll = 0;
    let sumType0 = 0;
    let sumType1 = 0;
    let sumType2 = 0;
    let sumType3 = 0;

    for (const item of newValue) {
      const { score, type } = item;
      scoreAll += score * 1;
      if (type == 0) {
        sumType0++;
      } else if (type == 1) {
        sumType1++;
      } else if (type == 2) {
        sumType2++;
      } else if (type == 3) {
        sumType3++;
      }
    }
    scoreAllRef.value = scoreAll;
    type0Ref.value = sumType0;
    type1Ref.value = sumType1;
    type2Ref.value = sumType2;
    type3Ref.value = sumType3;
  }

  const questionColumns: TableColumnList = [
    {
      type: "selection",
      align: "left",
      reserveSelection: true // 数据刷新后保留选项
    },
    {
      label: "ID",
      prop: "id",
      width: 100
    },
    {
      label: "题目",
      prop: "title",
      minWidth: 150,
      cellRenderer: ({ row }) => (
        <el-popover
          effect="light"
          trigger="hover"
          placement="top-start"
          width="300"
        >
          {{
            default: () => {
              return (
                <>
                  <el-card>
                    <div v-html={row.title} />
                  </el-card>
                </>
              );
            },
            reference: () => {
              // 去掉 HTML标签
              let result = row.title.replace(/(<([^>]+)>)/gi, "");
              //end
              const size = result.length;
              if (size > 40) {
                result = result.slice(0, 40) + "...";
              }
              return <div v-html={result} />;
            }
          }}
        </el-popover>
      )
    },
    {
      label: "分值",
      prop: "score",
      width: 100
    }
  ];

  onMounted(() => {
    setTimeout(function () {
      handleTypeChange(0);
    }, 300);
  });

  return {
    questionTypeRef,
    questionTableRef,
    queryPaperExtData,
    scoreFormInline,
    questionDataList,
    questionColumns,
    questionSelectRef,
    handleTypeChange,
    handleSelectionChange,
    countScoreAll,
    scoreAllRef,
    type0Ref,
    type1Ref,
    type2Ref,
    type3Ref
  };
}
